<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link rel="shortcut icon" href="${staticServerAddress }/title.ico">
	<link rel="stylesheet" href="css/iconfont.css">
	<link rel="stylesheet" href="css/global.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/styles.css">
	<script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="js/swiper.min.js" charset="UTF-8"></script>
	<script src="js/global.js" charset="UTF-8"></script>
	<script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<title>添加支付密码</title>
</head>
<body>
	<!-- 顶部tab -->
	<div class="tab-header">
		<div class="inner">
			<div class="pull-left">
				<div class="pull-left">嗨，欢迎来到<span class="cr">微风网</span></div>
				<a href="toAgentleavel">网店代销</a>
				<a href="toBreezeArticle4">帮助中心</a>
			</div>
			<div class="pull-right">
				<a href="toBreezeWelcome">我的微风</a>
				<a href="lineItem">我的订单</a>
				<a href="toBreezeIntegral">积分平台</a>
			</div>
		</div>
	</div>
	<!-- 顶部标题 -->
	<div class="bgf5 clearfix">
		<div class="top-user">
			<div class="inner">
				<a class="logo" href="home"><img src="images/icons/logo.jpg" alt="微风网" class="cover"></a>
				<div class="title">个人中心</div>
			</div>
		</div>
	</div>
	<div class="content clearfix bgf5">
		<section class="user-center inner clearfix">
			<div class="pull-left bgf">
				<a href="toBreezeWelcome" class="title">微风欢迎页</a>
				<dl class="user-center__nav">
					<dt>帐户信息</dt>
					<a href="toPersonalData"><dd>个人资料</dd></a>
					<a href="toMoneyManage"><dd>资金管理</dd></a>
					<a href="toBreezeIntegral"><dd>积分平台</dd></a>
					<a href="shippingAddress"><dd>收货地址</dd></a>
					<a href="toBreezeCoupon"><dd>我的优惠券</dd></a>
					<a href="toBreezePaypwdModify"><dd>修改支付密码</dd></a>
					<a href="toModifyPassword"><dd>修改登录密码</dd></a>
				</dl>
				<dl class="user-center__nav">
					<dt>订单中心</dt>
					<a href="lineItem"><dd>我的订单</dd></a>
					<a href="toFavorite?pageIdx=1"><dd class="active">我的收藏</dd></a>
					<a href="toBreezeRefund"><dd>退款/退货</dd></a>
				</dl>
				<dl class="user-center__nav">
					<dt>服务中心</dt>
					<a href="toBreezeMailQuery"><dd>物流查询</dd></a>
					<a href="#"><dd>数据自助下载</dd></a>
					<a href="toBreezeArticle1"><dd>售后服务</dd></a>
					<a href="toBreezeArticle2"><dd>配送服务</dd></a>
					<a href="toBreezeArticle3"><dd>用户协议</dd></a>
					<a href="toBreezeArticle4"><dd>常见问题</dd></a>
				</dl>
				<dl class="user-center__nav">
					<dt>新手上路</dt>
					<a href="toBreezeArticle5"><dd>如何成为代理商</dd></a>
					<a href="toBreezeArticle6"><dd>代销商上架教程</dd></a>
					<a href="toBreezeArticle7"><dd>分销商常见问题</dd></a>
					<a href="toBreezeArticle8"><dd>付款账户</dd></a>
				</dl>
				<dl class="user-center__nav">
					<dt>微风网</dt>
					<a href="toBreezeArticle10"><dd>企业简介</dd></a>
					<a href="toBreezeArticle11"><dd>加入微风</dd></a>
					<a href="toBreezeArticle12"><dd>隐私说明</dd></a>
				</dl>
			</div>
			<div class="pull-right">
				<div class="user-content__box clearfix bgf">
					<div class="title">账户信息-设置支付密码 <span style="margin-left: 200px; color: red; ">${addPaymentCodeErr}</span></div><br>
					<div class="step-flow-box">
						<div class="step-flow__bd">
							<div class="step-flow__li step-flow__li_done">
							  <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
							  <p class="step-flow__title-top">验证身份</p>
							</div>
							<div class="step-flow__line step-flow__line_ing">
							  <div class="step-flow__process"></div>
							</div>
							<div class="step-flow__li">
							  <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
							  <p  class="step-flow__title-top">重置支付密码</p>
							</div>
							<div class="step-flow__line">
							  <div class="step-flow__process"></div>
							</div>
							<div class="step-flow__li">
							  <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
							  <p class="step-flow__title-top">完成</p>
							</div>
						</div>
					</div>
					<form action="addPaymentCode" method="post" class="user-setting__form" role="form">
						<div style="width: 100%; height: 30px;">
							<span id="err_1"></span>
						</div>
						<div class="form-group">
							<input class="form-control phone" name="userPayPassword" required="" minlength="6" maxlength="16" autocomplete="off" type="password" placeholder="请输入您要设置的支付密码">	
						</div>
						<div style="width: 100%; height: 30px;">
							<span id="err_2"></span>
						</div>
						<div class="form-group">
							<input class="form-control phone" name="reUserPayPassword" required="" minlength="6" maxlength="16" autocomplete="off" type="password" placeholder="请确认您要设置的支付密码">	
						</div>
						<div style="width: 100%; height: 30px;">
							<span id="err_3"></span>
						</div>
						<!-- div class="form-group">
							<div class="input-group">
								<input class="form-control" required="" minlength="4" maxlength="4"  type="text">
								<span class="tip-text">输入邮箱验证码</span>
								<span class="input-group-btn">
									<button class="btn btn-pink" id="getsms" type="button">发送验证码</button>
								</span>
							</div>
						</div> -->
						<!-- <div style="width: 100%; height: 30px;">
							<span id="err_4"></span>
						</div> -->
						<div class="user-form-group tags-box">
							<button type="submit" class="btn ">提交</button>
						</div>
						<script src="js/login.js"></script>
						<script type="text/javascript">
								$(function(){
									$("[name=userEmail]").blur(function(){
										var userEmail = $("#userEmail").val();
										if(!userEmail.match(/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/)){
									        $("#err_1").empty();
	                  						$("#err_1").html("用户名格式为邮箱").appendTo("#err_1");
	                  						if($("#err_1").val()!=null){
	                  							setTimeout(function () {
												    $("#err_1").empty(); 
												 },6000);
	                  						}
	                  					}else{
	                  						$("#err_1").empty();
	                  						$("#err_1").html("用户名格式正确").appendTo("#err_1");
	                  						if($("#err_1").val()!=null){
	                  							setTimeout(function () {
												    $("#err_1").empty(); 
												 },6000);
									    	}	
										}
									});

									$("[name=reUserPayPassword]").blur(function(){ 
										var userPayPassword = $("[name=userPayPassword]").val();
										var reUserPayPassword = $("[name=reUserPayPassword]").val();
										if (!userPayPassword==reUserPayPassword) {
											$("#err_2").empty();
	                  							$("#err_2").html("两次密码不一致").appendTo("#err_2");
	                  							if($("#err_2").val()!=null||$("#err_").val()!=""){
	                  								setTimeout(function () {
												        $("#err_2").empty(); 
												    },6000);
	                  							}
										}
									});
								});		
						</script>
						<!-- <script>
							$(document).ready(function(){
								$('.form-control').on('blur focus',function() {
									$(this).addClass('focus');
									$('.error_tip').empty();
									if ($(this).val() == ''){$(this).removeClass('focus')}
								});
								$('#getsms').click(function() {
									var phone = $(this).parents('form').find('input.phone');
									var error = $(this).parents('form').find('.error_tip');
									switch(phone.validatemobile()) {
										case 0:
											// 短信验证码的php请求
											error.html('验证码 <strong>已发送</strong>');
											$(this).rewire(60);
										break;
										case 1: error.html('<strong>手机号码为空</strong> 请输入手机号码'); break;
										case 2: error.html('<strong>手机号码错误</strong> 请输入11位数的号码'); break;
										case 3: error.html('<strong>手机号码错误</strong> 请输入正确的号码'); break;
									}
								});
							});
						</script> -->
					</form>
				</div>
			</div>
		</section>
	</div>
	<!-- 右侧菜单 -->
	<div class="right-nav">
		<ul class="r-with-gotop">
			<li class="r-toolbar-item">
				<a href="toBreezeWelcome" class="r-item-hd">
					<i class="iconfont icon-user" ></i>
					<div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="toBreezeShopcart" class="r-item-hd">
					<i class="iconfont icon-cart" data-badge="${shoppingCartNum==null?0:shoppingCartNum }"></i>
					<div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="toFavorite?pageIdx=1" class="r-item-hd">
					<i class="iconfont icon-aixin"></i>
					<div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="#" class="r-item-hd">
					<i class="iconfont icon-liaotian"></i>
					<div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="toIssues" class="r-item-hd">
					<i class="iconfont icon-liuyan"></i>
					<div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
				</a>
			</li>
			<li class="r-toolbar-item to-top">
				<i class="iconfont icon-top"></i>
				<div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
			</li>
		</ul>
		<script>
			$(document).ready(function(){ $('.to-top').toTop({position:false}) });
		</script>
	</div>
	<!-- 底部信息 -->
	<div class="footer">
		<div class="footer-tags">
			<div class="tags-box inner">
				<div class="tag-div">
					<img src="images/icons/footer_1.gif" alt="厂家直供">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_2.gif" alt="一件代发">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_3.gif" alt="美工活动支持">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_4.gif" alt="信誉认证">
				</div>
			</div>
		</div>
		<div class="footer-links inner">
			<dl>
				<dt>微风网</dt>
				<a href="toBreezeArticle10"><dd>企业简介</dd></a>
				<a href="toBreezeArticle11"><dd>加入微风</dd></a>
				<a href="toBreezeArticle12"><dd>隐私说明</dd></a>
			</dl>
			<dl>
				<dt>服务中心</dt>
				<a href="toBreezeArticle1"><dd>售后服务</dd></a>
				<a href="toBreezeArticle2"><dd>配送服务</dd></a>
				<a href="toBreezeArticle3"><dd>用户协议</dd></a>
				<a href="toBreezeArticle4"><dd>常见问题</dd></a>
			</dl>
			<dl>
				<dt>新手上路</dt>
				<a href="toBreezeArticle5"><dd>如何成为代理商</dd></a>
				<a href="toBreezeArticle6"><dd>代销商上架教程</dd></a>
				<a href="toBreezeArticle7"><dd>分销商常见问题</dd></a>
				<a href="toBreezeArticle8"><dd>付款账户</dd></a>
			</dl>
		</div>
		<div class="copy-box clearfix">
			<ul class="copy-links">
				<a href="toAgentLevel"><li>网店代销</li></a>
				<a href="toClassRoom"><li>微风学堂</li></a>
				<a href="toBreezeAbout"><li>联系我们</li></a>
				<a href="toBreezeArticle10"><li>企业简介</li></a>
				<a href="toBreezeArticle5"><li>新手上路</li></a>
			</ul>
			<!-- 版权 -->
			<p class="copyright">
				© 2018-2020 微风网 版权所有，并保留所有权利<br>
				ICP备案证书号：渝ICP备20181806号-2&nbsp;&nbsp;&nbsp;&nbsp;重庆市沙坪坝区微电子产业园区&nbsp;&nbsp;&nbsp;&nbsp;Tel: 15881909100&nbsp;&nbsp;&nbsp;&nbsp;E-mail: 15881909100@qq.com
			</p>
		</div>
	</div>
</body>
</html>